<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>lcalendar时间选择器使用</title>
    <link rel="stylesheet" href="lCalendar.css">
    <style>
        input {
            border: 1px solid #cccccc;
            height: 30px;
            line-height: 30px;
            border-radius: 5px;
            font-size: 14px;
            width: 200px;
        }
    </style>
</head>

<body>
    <div>
        <div>
            <div>当前选择时间：
                <span id="yTimeShow"></span>
            </div>
            <input type="text" readonly id="yTime">
        </div>
        <div>
            <div>当前选择时间：
                <span id="ymTimeShow"></span>
            </div>
            <input type="text" readonly id="ymTime">
        </div>
        <div>
            <div>当前选择时间：
                <span id="xunTimeShow"></span>
            </div>
            <input type="text" readonly id="xunTime">
        </div>
        <div>
            <div>选择date类型
            </div>
            <input type="text" readonly id="dateTime">
        </div>
        <div>
            <div>选择datetime类型
            </div>
            <input type="text" readonly id="datetimeTime">
        </div>
        <div>
                <div>选择time类型
                </div>
                <input type="text" readonly id="timeTime">
            </div>

    </div>


</body>
<script src="LCalendar_wl.js"></script>
<script>
    var yTimeCalendar = new LCalendar();
    yTimeCalendar.init({
        'trigger': "#yTime", //时间input
        'type': 'y', //时间类型，date：YYYY-MM-DD;
        'val': "#yTimeShow"
    });
    var ymTimeCalendar = new LCalendar();
    ymTimeCalendar.init({
        'trigger': "#ymTime", //时间input
        'type': 'ym', //时间类型，date：YYYY-MM-DD;
        'val': "#ymTimeShow"
    });
    var xunTimeCalendar = new LCalendar();
    xunTimeCalendar.init({
        'trigger': "#xunTime", //时间input
        'type': 'xun', //时间类型，date：YYYY-MM-DD;
        'val': "#xunTimeShow"
    });
    var dateTimeCalendar = new LCalendar();
    dateTimeCalendar.init({
        'trigger': "#dateTime", //时间input
        'type': 'date', //时间类型，date：YYYY-MM-DD;
    });
    var datetimeTimeCalendar = new LCalendar();
    datetimeTimeCalendar.init({
        'trigger': "#datetimeTime", //时间input
        'type': 'datetime', //时间类型，date：YYYY-MM-DD;
    });
    var timeTimeCalendar = new LCalendar();
    timeTimeCalendar.init({
        'trigger': "#timeTime", //时间input
        'type': 'time', //时间类型，date：YYYY-MM-DD;
    });
</script>

</html>